<!-- 当前导航 -->
<div class="current-position">
  <!-- 面包屑 -->
  <nz-breadcrumb class="breadcrumb">
    <nz-breadcrumb-item>首页</nz-breadcrumb-item>
    <nz-breadcrumb-item>用户管理</nz-breadcrumb-item>
    <nz-breadcrumb-item>用户列表</nz-breadcrumb-item>
  </nz-breadcrumb>
  <h1 class="current-position-title">用户列表</h1>
  <h1 class="current-position-desc">指定条件下的用户列表</h1>
</div>
<!-- 主体内容 -->
<div class="main-content">

  <!-- 新建 -->
  <div style="margin-bottom: 24px;">
    <button [nzSize]="'large'" nz-button [nzType]="'primary'" [routerLink]="['./register']">
      <i class="anticon anticon-plus"></i>
      <span>新建</span>
    </button>
  </div>
  <!-- 用户列表 -->
  <nz-table #nzTable [nzDataSource]="userLs" [nzTotal]="userLs.length" [nzPageSize]="10">
    <thead nz-thead>
      <tr>
        <th nz-th>
          <span>id</span>
        </th>
        <th nz-th>
          <span>用户名</span>
        </th>
        <th nz-th>
          <span>角色</span>
        </th>
        <th nz-th>
          <span>操作</span>
        </th>
      </tr>
    </thead>
    <tbody nz-tbody>
      <tr nz-tbody-tr *ngFor="let data of nzTable.data; let i =index">
        <td nz-td>{{data.UserId}}</td>
        <td nz-td>{{data.UserName}}</td>
        <td nz-td>{{data.Role?.RoleName}}</td>
        <td nz-td>
          <span>
            <a href="javascript:;" [routerLink]="['./editor', data.UserId]">更新</a>
            <span nz-table-divider></span>
            <nz-dropdown>
              <a class="ant-dropdown-link" nz-dropdown>
                更多
                <i class="anticon anticon-down"></i>
              </a>
              <ul nz-menu>
                <!-- target="_blank" 在新的標籤頁打開 -->
                <li nz-menu-item>
                  <a (click)="deleteUser(i)" rel="noopener noreferrer" href="javascript:;">删除</a>
                </li>
                <li nz-menu-item>
                  <a [routerLink]="['./pwdupdate', data.UserId]" rel="noopener noreferrer" href="javascript:;">修改密码</a>
                </li>
                <li nz-menu-item>
                  <a [routerLink]="['./authorization', data.UserId, false]" rel="noopener noreferrer" href="javascript:;">app权限管理</a>
                </li>
              </ul>
            </nz-dropdown>
          </span>
        </td>
      </tr>
    </tbody>
  </nz-table>
</div>